import { fileURLToPath, URL } from 'node:url'

import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
// import VueDevTools from 'vite-plugin-vue-devtools'

import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { VantResolver, NaiveUiResolver } from 'unplugin-vue-components/resolvers'
import DefineOptions from 'unplugin-vue-define-options/dist/vite'
import viteCompression from 'vite-plugin-compression'
import { visualizer } from 'rollup-plugin-visualizer'

// https://vitejs.dev/config/
export default defineConfig(({ mode }) => {
  let env = loadEnv(mode, process.cwd())
  return {
    build: {
      outDir: 'dist',
      target: 'es2015',
      gzipSize: true,
      // 关闭生成map文件 可以达到缩小打包体积
      // 这个生产环境一定要关闭，不然打包的产物会很大
      sourcemap: false,
      // chunk 大小警告的限制（单位 KB）
      chunkSizeWarningLimit: 1024,
      // 启用/禁用 gzip 压缩大小报告 
      reportCompressedSize: false,
      minify: 'terser',
      terserOptions: {
        compress: {
          // 生产环境时移除 console
          drop_console: true,
          drop_debugger: true,
        }
      },
      rollupOptions: {
        output: {
          // 引入文件名的名称
          chunkFileNames: 'js/[name]-[hash].js',
          // 包的入口文件名称
          entryFileNames: 'js/[name]-[hash].js',
          manualChunks(id) {
            if (id.includes("node_modules")) {
              // 让每个插件都打包成独立的文件
              return id.toString().split("node_modules/")[1].split("/")[0].toString();
            }
          }
        }
      }
    },
    plugins: [
      vue(),
      // VueDevTools(),
      AutoImport({
        // 自动导入系统的 如 ref、reactive、toRef、shallowRef、onMounted 等
        // '@vueuse/core' 自动释放
        imports: [
          'vue',
          'vue-router',
          '@vueuse/core',
          {
            'naive-ui': [
              'useDialog',
              'useMessage',
              'useNotification',
              'useLoadingBar'
            ]
          }
        ],
        // 自动生成声明文件
        // 用来自动导入自定义的文件（但是此方法不利于查找路径源文件）
        // dts: 'src/auto-imports.d.ts',
        dts: false,
        resolvers: [VantResolver(), NaiveUiResolver()],
      }),
      Components({
        resolvers: [VantResolver(), NaiveUiResolver()]
      }),
      DefineOptions(),
      viteCompression({
        verbose: true,
        disable: false,
        threshold: 10240,
        // 压缩算法，可选['gzip'，' brotliccompress '，'deflate '，'deflateRaw']
        algorithm: 'gzip',
        ext: '.gz',
        // 源文件压缩后是否删除
        deleteOriginFile: false
      }),
      // 将 visualizer 插件放到最后
      visualizer({
        // 打包后自动开启分析页面
        open: true
      }),
    ],
    resolve: {
      alias: {
        '@': fileURLToPath(new URL('./src', import.meta.url))
      }
    },
    server: {
      host: '0.0.0.0',
      port: env.VITE_PORT,
      open: true,
      proxy: {
        VITE_BASE_API: {
          // 要请求的后台地址
          target: env.VITE_SERVE,
          // 是否跨域
          changeOrigin: true,
          // 路径重写 把前面的包含的 api 去掉
          rewrite: (path) => path.replace(/^\/api/, ''),
          // 设置响应标头查看转发路径
          bypass(request, response, options) {
            let proxy = options.target + options.rewrite(request.url)
            response.setHeader('x-response-proxy-url', proxy)
          }
        },
        '/gateway': {
          target: env.VITE_SERVER,
          changeOrigin: false,
        }
      }
    },
  }
})
